// 等待DOM加载完成
document.addEventListener('DOMContentLoaded', function() {
    // 搜索功能实现
    const searchInput = document.getElementById('search-input');
    const searchBtn = document.getElementById('search-btn');
    const allLinks = document.querySelectorAll('.links a');
    
    // 搜索按钮点击事件
    searchBtn.addEventListener('click', performSearch);
    
    // 输入框回车事件
    searchInput.addEventListener('keypress', function(e) {
        if (e.key === 'Enter') {
            performSearch();
        }
    });
    
    // 搜索函数
    function performSearch() {
        const searchTerm = searchInput.value.toLowerCase().trim();
        
        if (searchTerm === '') {
            // 如果搜索框为空，显示所有链接
            allLinks.forEach(link => {
                link.style.display = 'block';
                link.parentElement.parentElement.style.display = 'block';
            });
            return;
        }
        
        // 标记是否有匹配项
        let hasMatches = false;
        
        // 获取所有分类
        const categories = document.querySelectorAll('.category');
        
        categories.forEach(category => {
            const categoryTitle = category.querySelector('h2').textContent.toLowerCase();
            const links = category.querySelectorAll('.links a');
            let categoryHasMatches = false;
            
            // 检查每个链接
            links.forEach(link => {
                const linkText = link.textContent.toLowerCase();
                
                if (linkText.includes(searchTerm) || categoryTitle.includes(searchTerm)) {
                    link.style.display = 'block';
                    categoryHasMatches = true;
                    hasMatches = true;
                } else {
                    link.style.display = 'none';
                }
            });
            
            // 根据分类是否有匹配项决定是否显示分类
            category.style.display = categoryHasMatches ? 'block' : 'none';
        });
        
        // 如果没有匹配项，显示提示
        const noResultsMsg = document.getElementById('no-results');
        if (!hasMatches) {
            if (!noResultsMsg) {
                const msg = document.createElement('div');
                msg.id = 'no-results';
                msg.textContent = '没有找到匹配的站点';
                msg.style.textAlign = 'center';
                msg.style.padding = '30px';
                msg.style.color = '#666';
                msg.style.fontSize = '1.1rem';
                
                const categoryContainer = document.querySelector('.category-container');
                categoryContainer.appendChild(msg);
            }
        } else if (noResultsMsg) {
            noResultsMsg.remove();
        }
    }
    
    // 添加链接悬停动画效果
    allLinks.forEach(link => {
        link.addEventListener('mouseenter', function() {
            this.style.transform = 'translateY(-3px) scale(1.02)';
        });
        
        link.addEventListener('mouseleave', function() {
            this.style.transform = 'translateY(0) scale(1)';
        });
    });
    
    // 平滑滚动效果
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function(e) {
            e.preventDefault();
            const targetId = this.getAttribute('href');
            const targetElement = document.querySelector(targetId);
            
            if (targetElement) {
                window.scrollTo({
                    top: targetElement.offsetTop - 20,
                    behavior: 'smooth'
                });
            }
        });
    });
    
    // 页面加载动画
    const container = document.querySelector('.container');
    container.style.opacity = '0';
    container.style.transform = 'translateY(20px)';
    container.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
    
    setTimeout(() => {
        container.style.opacity = '1';
        container.style.transform = 'translateY(0)';
    }, 100);
    
    // 随机背景色效果（可选功能）
    const randomizeColors = false; // 设置为true启用
    
    if (randomizeColors) {
        const colors = ['#667eea', '#764ba2', '#f093fb', '#f5576c', '#4facfe', '#00f2fe'];
        const categories = document.querySelectorAll('.category h2');
        
        categories.forEach(category => {
            const randomColor = colors[Math.floor(Math.random() * colors.length)];
            category.style.color = randomColor;
        });
    }
});